<template>
	<view class="help-container">
		<view class="text-title">
			<svg-icon :icon="menuOptions.meta.icon" />{{ menuOptions.meta.title }}
		</view>
		<view class="childList">
			<view v-for="(child, zindex) in menuOptions.children" :key="zindex" class="question" hover-class="hover"
				@click="handleText(child)">
				<view class="text-item">{{ child.meta.title }}</view>
				<view class="line" v-if="zindex !== menuOptions.children.length - 1"></view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import config from '@/config'
	import {
		ref,
		getCurrentInstance,
	} from 'vue'
	import {
		onLoad,
	} from '@dcloudio/uni-app'
	const {
		proxy
	} = getCurrentInstance();
	const menuOptions = ref({meta:{}})
	onLoad((params) => {
		uni.$once('menu', function(data){
			uni.setNavigationBarTitle({
				title: data.meta.title
			});
			menuOptions.value = data
		})
	})
	const handleText = (node) => {
		if(config.isCloud) {
			if(node.component === 'system/operlog/index') {
				node.component = 'monitor/operlog/index'
			} else if(node.component === 'system/logininfor/index') {
				node.component = 'monitor/logininfor/index'
			}
		}
		if (node.component == 'ParentView') { //是三级目录
			uni.navigateTo({
				url: "menu",
				success:function(){
					uni.$emit('menu', node)
				}
			});
		} else if (typeof node.meta.link === 'string') { //是外链
			proxy.$tab.navigateTo(`/pages/common/webview/index?title=${node.meta.title}&url=${node.meta.link}`)
		} else {
			uni.navigateTo({
				url: '/pages_work/' + node.component,
				fail: function(res) {
					if('navigateTo:fail timeout' === res.errMsg) {
						return
					}
					proxy.$tab.navigateTo(`/pages/common/textview/index?title=页面不存在&content=暂无该页面，请耐心等待`);
					proxy.$modal.showToast('模块建设中~')
				}
			})
			// proxy.$tab.navigateTo(node.component);
		}
			
		// if('monitor/operlog/index' == node.component) node.component = 'system/operlog/index'
		// if('monitor/logininfor/index' == node.component) node.component = 'system/logininfor/index'
	}
</script>

<style lang="scss" scoped>
	.help-container {
		margin-bottom: 100rpx;
		padding: 30rpx;
	}

	.list-title {
		margin-bottom: 30rpx;
	}

	.childList {
		background: #ffffff;
		box-shadow: 0px 0px 10rpx rgba(193, 193, 193, 0.2);
		border-radius: 16rpx;
		margin-top: 10rpx;
	}

	.line {
		width: 100%;
		height: 1rpx;
		background-color: #F5F5F5;
	}

	.text-title {
		color: #303133;
		font-size: 32rpx;
		font-weight: bold;
		margin-left: 10rpx;

		.iconfont {
			font-size: 16px;
			margin-right: 10rpx;
		}
	}

	.text-item {
		font-size: 28rpx;
		padding: 24rpx;
	}

	.question {
		color: #606266;
		font-size: 28rpx;
	}
</style>

<style lang="scss">
	//仅设置背景，不推荐在这里写样式代码
	page {
		background-color: #f8f8f8;
	}
</style>